<template>
  <div>
    <div>
      <h2>1.v-bind的基本使用</h2>
      <img v-bind="imgUrl" alt="" style="width: 40px" />
      <a v-bind:href="link">百度一下</a>
    </div>
    <div>
      <h2>2.v-bind 提供一个语法糖</h2>
      <!-- 2.v-bind 提供一个语法糖：-->
      <img :src="imgUrl" alt="" style="width: 40px" />
      <div>
        直接绑定 imgUrl 字符串给src,原生html语法
        <img
          src="https://v2.cn.vuejs.org/images/logo.svg"
          alt=""
          style="width: 40px"
        />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'page-day3',
  data() {
    return {
      imgUrl: 'https://v2.cn.vuejs.org/images/logo.svg',
      link: 'https://www.baidu.com'
    }
  }
}
</script>

<style lang="scss" scoped></style>
